import React from "react";
import Household from "./Household";

const Guest = () => {
    // 返回
    const back = () => {
        React.navigate(-1)
    }

    // 获取id
    const [searchParams] = React.Router.useSearchParams()
    let [id, SetID] = React.useState(searchParams.get('id') ? searchParams.get('id') : 0)
    React.useEffect(()=>{
        getData()
    },[])

    const [form] = React.UI.Form.useForm()
    const getData = async ()=>{
        if(!id) return false
        let result:any = await React.HTTP.post("/business/getHousehold",{id})
        if(result.code){
            form.setFieldsValue({
                nickname:result.data.nickname,
                mobile:result.data.mobile,
                gender:result.data.gender,
            })
        }else{
            React.error(result.msg)
            return false
        }
    }


    const onFinsh = async (values: any) => {
        values.busid = React.Business.id
        // 判断是否带有id
        if(id){
            values.id = id
        }
        let result = await React.HTTP.post("/business/guest", values)
        if (result.code == 1) {
            React.success(result.msg, () => {
                React.navigate(-1)
            })
        } else {
            React.error(result.msg)
            return false
        }
    }
    return (
        <>
            <React.UI.NavBar onBack={back}>信息登记</React.UI.NavBar>
            <React.UI.Form
                layout='horizontal'
                onFinish={onFinsh}
                form={form}
                footer={
                    <React.UI.Button block type='submit' color='primary' size='large'>
                        提交
                    </React.UI.Button>
                }
            >
                <React.UI.Form.Header>客户信息登记</React.UI.Form.Header>
                <React.UI.Form.Item
                    name='nickname'
                    label='姓名'
                    rules={[{ required: true, message: '姓名不能为空' }]}
                >
                    <React.UI.Input type="text" placeholder='请输入姓名' />
                </React.UI.Form.Item>
                <React.UI.Form.Item
                    name='mobile'
                    label='手机号码'
                    rules={[{ required: true, message: "请输入手机号" }, { pattern: /^1[3-9]{1}\d{9}$/, message: "手机号格式不正确" }]}
                >
                    <React.UI.Input type="tel" placeholder='请输入手机号码' />
                </React.UI.Form.Item>
                <React.UI.Form.Item name='gender' label='性别' rules={[{ required: true, message: "请选择性别" }]}>
                    <React.UI.Radio.Group >
                        <React.UI.Space direction='horizontal'>
                            <React.UI.Radio value='0'>男</React.UI.Radio>
                            <React.UI.Radio value='1'>女</React.UI.Radio>
                        </React.UI.Space>
                    </React.UI.Radio.Group>
                </React.UI.Form.Item>
            </React.UI.Form>
            <div style={{textAlign:"center",}}>
                <React.Router.Link to={"/business/household"}>查看已登记信息</React.Router.Link>
            </div>
        </>
    )
}

export default Guest